<template>
  <UserCardList :user-list="userList"></UserCardList>
  <van-empty v-if="!userList || userList.length < 1" description="搜索结果为空" />
</template>
<script setup lang="ts">
import {useRoute} from "vue-router";
import {onMounted, ref} from "vue";
import myAxios from "../plugins/myAxios"
import {Toast} from "vant";
import qs from 'qs'
import {UserType} from "../models/user";
import UserCardList from "../components/UserCardList.vue";

const route = useRoute()
const {tags} = route.query

const userList = ref([])

onMounted(async () => {
  const userListData: UserType[] = await myAxios.get('/user/search/tags', {
    params: {
      tagNameList: tags
    },
    //序列化
    paramsSerializer: function (params) {
      return qs.stringify(params, { arrayFormat: "repeat" });
    },

  })
      .then(function (response) {
        console.log("/user/search/tags success", response);
        Toast.success("请求成功")
        return response?.data;
      })
      .catch(function (error) {
        console.log("/user/search/tags error",error);
        Toast.fail("请求失败")
      })
      if (userListData){
        userListData.forEach((user) => {
          if(user.tags){
            user.tags = JSON.parse(user.tags);
          }
        })
        userList.value = userListData;
      }
})


const mockUser = {
  id: 123,
  username: '鱼皮',
  userAccount: '12332',
  avatarUrl: "https://pic.code-nav.cn/user_avatar/1802890093225947137/thumbnail/ATLKAgGFldK9jTqu.png",
  profile: '这是个人简介，没又地地道道的顶顶顶顶顶顶顶顶顶',
  gender: 0,
  phone: '13517013953',
  email: '1344@qq.com',
  userRole: 0,
  planetCode: '1234',
  tags: ['java', 'emo', 'python', '学习后'],
  createTime: new Date(),
}



</script>
<style scoped>

</style>